<template>
  <div class="m-page">
    <m-header title="综合看板"></m-header>
    <div class="m-body">
      <m-row :gutter="20" class="floor1">
        <m-col :span="7">
          <m-row :gutter="20">
            <m-col :span="24">
              <!-- 采购分析 -->
              <purchaseAnalysis />
            </m-col>
            <m-col :span="24">
              <!-- 品质管理 -->
              <qualityManagement />
            </m-col>
          </m-row>
        </m-col>
        <m-col :span="10"></m-col>
        <m-col :span="7">
          <m-row :gutter="20">
            <m-col :span="24">
              <!-- 生产管理 -->
              <productManagement />
            </m-col>
            <m-col :span="24">
              <!-- 物料配套 -->
              <materialMatch />
            </m-col>
          </m-row>
        </m-col>
      </m-row>
      <m-row :gutter="20" class="floor2">
        <m-col :span="7">
          <!-- 仓库管理 -->
          <warehouseManagement />
        </m-col>
        <m-col :span="10"></m-col>
        <m-col :span="7">
          <!-- 设备管理 -->
          <equipmentManagement />
        </m-col>
      </m-row>
    </div>
  </div>
</template>

<script setup>
import mHeader from '@/components/common/mHeader/index.vue'
// 采购分析
import purchaseAnalysis from './components/purchaseAnalysis/index.vue'
// 物料配套
import materialMatch from './components/materialMatch/index.vue'
// 设备管理
import equipmentManagement from './components/equipmentManagement/index.vue'
// 品质管理
import qualityManagement from './components/qualityManagement/index.vue'
// 仓库管理
import warehouseManagement from './components/warehouseManagement/index.vue'
// 生产管理
import productManagement from './components/productManagement/index.vue'
</script>
<style lang="less" scoped>
.m-page {
  .m-body {
    .m-row {
      margin-bottom: 0;
      &.floor1 {
        height: 66%;
        .m-col {
          height: 100%;
          padding: 0 !important;
          // border: 1px solid #ccc;
          .m-row {
            height: 50%;
          }
        }
      }
      &.floor2 {
        height: 34%;
        .m-col {
          height: 100%;
          // border: 1px solid #ccc;
          padding: 0 !important;
        }
      }
    }
  }
}
</style>
